import ActionGroup from "./ActionGroup.vue"
import moment from "moment";
import { globalStore } from "@/store/global";
const globalVue = globalStore();
/**
 * tooltip {boolean}  
 */

const columns = (showOperate) => {
  let opction = globalVue.alarmSelect;
  let arr = [
    // {
    //   type: 'selection',
    //   width: 55
    // },
    {
      label: 'Alarm Number',
      prop: 'alarmUuid',
      // width: 260,
      tooltip: true,
    },
    {
      label: 'Organization',
      prop: 'hospital',
      width: 110,
      tooltip: true,
    },
    {
      label: 'City',
      prop: 'city',
      width: 160,
      tooltip: true,
    },
    {
      label: 'Code Number',
      prop: 'codenumber',
      // width: 120,
      tooltip: false,
    },
    {
      label: 'Camera ID',
      prop: 'deviceId',
      width: 200,
      tooltip: true,
    },
    {
      label: 'Algorithm',
      prop: 'alarmType',
      width: 160,
      tooltip: false,
      // render: AlarmName,
      formatter: (row, column, cellValue, index) => {
        let comObject = opction.find(i => i.label == row.alarmTypeName) || opction[0];
        return <div class={'mw_box ' + comObject.stateName}>
          <img src={comObject.icon} alt="" />
          <span>{comObject.stateName}</span>
        </div>
      }
    },
    {
      label: 'Driver',
      prop: 'driverName',
      width: 120,
      tooltip: true,
    },
    {
      label: 'Position',
      prop: 'address',
      // width: 120,
      tooltip: false,
      formatter: (row, column, cellValue, index) => {
        return <el-tooltip effect="car" content={row.gpsLatitude + '，' + row.gpsLongitude} placement="right">
          <div>{row.gpsLatitude}, {row.gpsLongitude}</div>
        </el-tooltip>
        return
      }
    },
    {
      label: 'Alarm Level',
      prop: 'alarmLevel',
      width: 100,
      tooltip: false,
    },
    {
      label: 'Handle',
      prop: 'status',
      width: 100,
      tooltip: false,
      formatter: (row, column, cellValue, index) => {
        let vNode;
        if (row.status == 0) {
          vNode = <div class='not_with'>untreated</div>
        } else {
          vNode = <div class='yes_with'>processed</div>
        }
        return vNode;
      }
    },
    {
      label: 'Time',
      prop: 'alarmTime',
      width: 160,
      tooltip: false,
      formatter: (row, column, cellValue, index) => {
        return <el-tooltip effect="car" content={row.alarmTime ? moment(row.alarmTime).format('yyyy-MM-DD HH:mm:ss') : ''} placement="right">
          <div>
            {row.alarmTime ? moment(row.alarmTime).format('yyyy-MM-DD HH:mm:ss') : ''}
          </div>
        </el-tooltip>
      }
    },
  ]
  if (showOperate) {
    arr.push({
      label: "Operate",
      width: 180,
      render: ActionGroup
    })
  }
  return arr;
};
export default columns;